<template>
  <view class="article-card" @click="goArticle">
    <view class="article-main">
      <view class="article-title" v-html="item.articleTitle"></view>
      <view class="article-desc">{{ item.desc }}</view>
      <!-- <view class="article-meta">
        热度 {{ item.hot }}
        <text v-if="item.vip" class="vip-tag">VIP</text>
      </view> -->
    </view>
   
  </view>
</template>

<script>

  export default {
    name: 'TmpArticleCopywriting',
    props: {
      item: {
        type: Object,
        required: true
      }
    },
    methods: {
      goArticle(){
        let articleCode = this.item.articleCode;
        uni.navigateTo({
          url: '/pages/article/article-wa?articleCode='+articleCode
        });
      }
    },
  }

</script>

<style scoped>
  .article-card {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background: rgba(255,229,100,.3);
    border-radius: 18rpx;
    box-shadow: 0 4rpx 24rpx 0 rgba(36,104,242,0.04);
    margin-bottom: 32rpx;
    padding: 60rpx 60rpx;
  }
  .article-main {
    flex: 1;
  }
  .article-title {
    font-size: 28rpx;
    color: #6b5900;
    /* font-weight: 500; */
    margin-bottom: 12rpx;
  line-height: 2.0;
  }
  .article-desc {
    font-size: 26rpx;
    color: #666;
    margin-bottom: 18rpx;
  }
  .article-meta {
    font-size: 22rpx;
    color: #bbb;
  }
  .vip-tag {
    color: #FFD700;
    margin-left: 12rpx;
  }
  .article-img-box {
    width: 90rpx;
    height: 90rpx;
    background: #f8f9fe;
    border-radius: 16rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 18rpx;
  }
</style>
